<html>
    <head>
        <title>uni.navigateTo</title>
    </head>
    <body>
        <script>
            // uni.navigateT0(Object)

                    /*
                        一、概述

                                    保留当前页面，跳转到应用内的某个页面，使用 uni.navigateBack 可以返回到原页面。

                    */

                    /*
                        二、navigateTo兼容性

                                    HarmonyOS
                                    HBuilderX 4.23
                    */


                    /*
                         三、OBJECT参数说明

                              1、参数列表

                                        参数	            类型	    必填	默认值	        说明	                                                                            平台差异说明
                                    
                                    ①、url	               String	    是		            需要跳转的应用内非 tabBar 的页面的路径 , 
                                                                                            路径后可以带参数。参数与路径之间使用?分隔，参数键与参数值用=相连，不同参数用&分隔；
                                                                                            如 'path?key=value&key2=value2'，path为下一个页面的路径，
                                                                                            下一个页面的onLoad函数可得到传递的参数	

                                    ②、animationType	   String	    否	    pop-in	    窗口显示的动画效果，详见：窗口动画	                                                            App
                                    
                                    ③、animationDuration   Number	    否	    300	        窗口动画持续时间，单位为 ms	                                                                   App
                                    
                                    ④、events	           Object	    否		            页面间通信接口，用于监听被打开页面发送到当前页面的数据。2.8.9+ 开始支持。	
                                    
                                    ⑤、success	           Function	    否		            接口调用成功的回调函数	
                                    
                                    ⑥、fail	               Function	    否		            接口调用失败的回调函数	
                                    
                                    ⑦、complete	           Function	    否		            接口调用结束的回调函数（调用成功、失败都会执行）	


                             2、 object.success 回调函数

                                    <1>、参数

                                            Object res

                                                    属性	类型	说明
                                                    eventChannel	EventChannel	和被打开页面进行通信
                    */

                    /*
                          四、示例

                                    //在起始页面跳转到test.vue页面并传递参数
                                    uni.navigateTo({
                                        url: 'test?id=1&name=uniapp'
                                    });


                                    // 在test.vue页面接受参数
                                    export default {
                                        onLoad: function (option) {     //option为object类型，会序列化上个页面传递的参数
                                            console.log(option.id);     //打印出上个页面传递的参数。
                                            console.log(option.name);   //打印出上个页面传递的参数。
                                        }
                                    }

                                    
                                    // 在起始页面跳转到 test.vue 页面，并监听 test。vue 发送过来的事件数据
                                    uni。navigateTo({
                                        url:'/pages/test?id=1',
                                        events:{
                                            // 为指定事件添加一个监听器，获取被打开页面传送到当前页面的数据

                                            acceptDataFromOpenedPage:function(data){
                                                console.log(data)
                                            },
                                            soneEvent:function(data){
                                                console.log(data)
                                            }

                                            。。。。
                                        },

                                        success:function(res){
                                            // 通过eventChannel 向被打开页面传递数据
                                            res.eventChannel.emit('acceptDataFromOpenerPage',{data:'data from starter page'})
                                        }
                                    });


                                    // 在test.vue 页面，向起始页通过事件传递数据
                                    onLoad:function(option){

                                            const eventChannel = this.getOpenerEventChannel();

                                            eventChannel.emit('acceptDataFromOpenedPage', {data: 'data from test page'});

                                            eventChannel.emit('someEvent', {data: 'data from test page for someEvent'});

                                            // 监听acceptDataFromOpenerPage事件，获取上一页面通过eventChannel传送到当前页面的数据
                                            eventChannel.on('acceptDataFromOpenerPage', function(data) {
                                                console.log(data)
                                            })
                                    }



                            ★、注意：

                                    url 有长度限制，太长的字符串会传递失败，可改用 "窗体通信"、"全局变量",

                                    另外参数中出现＂空格＂等特殊字符时，需要对参数进行编码，如下使用 encodeURIComponent 对参数进行编码的示例：

                                            // 对url参数进行编码
                                            <navigator :url="'/pages/test/test?item='+ encodeURIComponent(JSON.stringify(item))"></navigator>

                                            // 在test.vue页面接收参数时，进行解码
                                            onLoad:function(option){
                                                const item = JOSN.parse(decodeURIComponent(option.item))
                                            }
                    */

                    /*
                         五、注意：

                                 ①、页面跳转路径有层级限制，不能无限制跳转新页面

                                 ②、跳转到 tabBar 页面只能使用 switchTab 跳转

                                 ③、路由API的目标页面必须是在 pages.json 里注册过的vue页面。 如果想打开 web url，在App平台可以使用  plus。runtime。openUrl 或 web-view 组件。

                                        H5平台使用 window.open ;  小程序平台使用 web-view 组件(url 需要在小程序的联网白名单中)。 
                                        
                                        在 Hello uni-app 中有个组件 ulink.vue已经对多端进行了封装，可参考。。 
                    */
        </script>
    </body>
</html>